
<template>
  <div>
    <Modal
      v-model="showBox"
      title="专利 - 增值服务购买"
      :footer-hide="true"
      :mask-closable="false"
      @on-visible-change="vChange"
      class-name="vertical-center-modal"
      width="500"
    >
      <div class="marginB20" style="background:red;color:white; padding:50px 20px;height:600px; overflow-y:auto; margin:-16px;">
        <h1>这里是很漂亮的设计</h1>
        <h1>图文简介</h1>
        <h1>诱惑用户购买综合套餐</h1>
        <h2>综合套餐xxx钱</h2>
        <h2>专利搜索一年(送专利管理xxx)，1800钱</h2>
        <h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1>
        <h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1>
        <h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1>
        <h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1>
        <h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1>
        <h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1>
        <h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1><h1>图文简介</h1>
      </div>
      <!-- <ul class="tBoxd padding0 textCenter">
        <li 
          class="textLink " 
          :class="$app.judgeData(zhongObj) && (zhongObj.id== val.id) && ' zhong'"
          v-for="(val,i) in taoClist" 
          :key="'d'+i"  
          style="width:30%;"
          @click="zTunChange(val)"
        >
          {{val.name}}
          <i class="iconfont iconjiaobiaoxuanzhong f_30 absolute" ></i>
        </li>
      </ul> -->
      <Row :gutter="15">
        <Col :span="12">
          <Button type="default" size="large" long @click="goFun(1)">专利检索一年</Button>
        </Col>
        <Col :span="12">
          <Button type="primary" size="large" long @click="wTp">综合套餐</Button>
        </Col>
      </Row>
      
    </Modal>

    <PayBox ref="payBox" :noOrderList="true"/>

  </div>
</template>

<style lang="less" scoped>
    @import './css/temp.less';
</style>


<script>
import PayBox from "@$@/_service/payBox";
export default {
  name: "taoCan_tm",
  components: {PayBox},
  data() {
    let data = {
      // 弹框是否显示
      showBox:false,
      taoClist:[],//支付套餐列表

      //选中的大对象
      zhongObj:{},
     
    };
    return data;
  },
  created() {
    $ajax.psGoodsList('',resData=>{
      this.taoClist=resData;
    });
  },
  methods: {
    vChange(buEr){
      if(buEr){
        $ajax.psGoodsList('',resData=>{
          this.taoClist=resData;
        });
      }else{//关闭

        // 初始化数据
        setTimeout(()=>{
          this.taoClist=[];
          this.zhongObj={};
        },200);
      }

    },
    goFun(num){
      let {
        taoClist
      }=this;

      
      $ajax.psGL_buy(taoClist[num].id,resData=>{
        let {
          order_id
        }=resData;
        $app.payBoxShow(this,order_id,{
          payFun:()=>{
            console.log('超级可爱');
          }
        });
      });


    },
    zTunChange(obj,i){
      this.zhongObj=obj;
    },
    wTp(){
      $app.confirm('综合套餐后台，还是个测试版','需要看吗？',{
        yesFun:()=>{
          // 套餐类型：1商标检索,2商标管理,3拓客,4商标分析报告包年,5专利管理,6专利搜索,7专利查重,8混合套餐
          $ajax.psGoodsList(8,resData=>{
            if(!$app.judgeData(resData)){
              $app.alert('混合套餐数据为空');
            }else{
              console.log('8混合套餐 = ',resData)
            }
            
          });
        }
      })
    },
    
  }
};
</script>
